<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link rel="stylesheet" type="text/css" href="../../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../../css/common.css" />
	<link rel="stylesheet" type="text/css" href="../../css/aui.css" />
  <link rel="stylesheet" type="text/css" href="../../css/aui-pull-refresh.css" />
  <title>学术</title>
  <style>
		html, body {width: 100%;min-height: 100%;background: #f0f0f0;}
    .h20 {height: 0.5rem;background: #f0f0f0;}

    .xqqList ul {
      background: #f0f0f0;
    }
    .xqqList .aui-list-item {
      background: #fff;
      margin: 0.5rem 0;
    }
    .xqqList {
      min-height: calc(100vh - 65px)
    }
	</style>
</head>
<body>
<section class="aui-refresh-content">
<div class="aui-content xqqList" id="app" v-cloak>
  <ul class="aui-list aui-media-list">
    <li class="aui-list-item aui-list-item-middle" v-for="item in newsList" @click="openPage('sj_hd', item.name, item.id,item.groupid)">
      <div class="aui-media-list-item-inner">
        <div class="aui-list-item-media" style="width: 3rem;">
          <img :src="item.image" class="aui-img-round aui-list-img-sm">
        </div>
        <div class="aui-list-item-inner">
          <div class="aui-list-item-text">
            <div class="aui-list-item-title aui-font-size-14">{{item.name}}</div>
          </div>
        </div>
      </div>
    </li>
  </ul>
</div>
</section>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/aui-scroll.js"></script>
<script type="text/javascript" src="../../script/vue.min.js"></script>
<script type="text/javascript" src="../../script/utils.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script src="../../script/aui-pull-refresh.js"></script>
<script type="text/javascript">

	apiready = function() {
		var URL = 'http://kexiecs.unohacha.com/kexieScore';

		var app = new Vue({
			el: '#app',
			data: {
				banner: [],
				newsList: [],
				page: 1,
        totalpage: 1
			},
			created: function() {
				var $_this = this;

				api.ajax({
				  url: URL + '/interest/getInterestList/' + $_this.page,
					timeout: 300,
				}, function(ret, err) {
				    if (ret) {
              // api.alert({ msg: JSON.stringify(ret) });
				        // console.log(JSON.stringify(ret));
                if (ret.data == null) return
								$_this.totalpage = ret.data.totalpage
                $_this.newsList = ret.data.newsList
				    } else {
				        api.alert({ msg: JSON.stringify(err) });
				    }
				})
        var scroll = new auiScroll({
            listen:true, //是否监听滚动高度，开启后将实时返回滚动高度
            distance:40 //判断到达底部的距离，isToBottom为true
        },function(ret){
           if (ret.isToBottom) {
             $_this.page ++
             if ($_this.page > $_this.totalpage) {
               $_this.page = $_this.totalpage
               return
             }
             api.ajax({
     				  url: URL + '/interest/getInterestList/' + $_this.page,
     					timeout: 300,
     				}, function(ret, err) {
     				    if (ret) {
     				       //  api.alert({ msg: JSON.stringify(ret) });
     								$_this.newsList = $_this.newsList.concat(ret.data.newsList)
     				    } else {
     				        api.alert({ msg: JSON.stringify(err) });
     				    }
     				})
           }

        });

        var pullRefresh = new auiPullToRefresh({
            container: document.querySelector('.aui-refresh-content'),
            triggerDistance: 100
        },function(ret){
            if(ret.status=="success"){
              $_this.page = 1
              api.ajax({
                url: URL + '/interest/getInterestList/' + $_this.page,
                timeout: 300,
              }, function(ret, err) {
                  if (ret) {
                    // api.alert({ msg: JSON.stringify(ret) });
                      // console.log(JSON.stringify(ret));
                      setTimeout(function() {
                        if (ret.data == null){
                          pullRefresh.cancelLoading(); //刷新成功后调用此方法隐藏
                          return;
                        }
                        $_this.totalpage = ret.data.totalpage
                        $_this.newsList = ret.data.newsList
                          pullRefresh.cancelLoading(); //刷新成功后调用此方法隐藏
                      },500)

                  } else {
                      api.alert({ msg: JSON.stringify(err) });
                  }
              })
            }
        })

			},
			methods: {
        openPage:function (type, title, id,groupid) {
          api.openWin({
            name: 'index_' + type,
            pageParam: {
              name: 'index_' + type,
              title: title,
              id: id,
              groupid:groupid
            },
            url: './index_sj_hd.html',
            delay: 200,
            bounces: false
          });
        }
			}
		})
	}



</script>
</body>
</html>
